<template>
  <div>
    当前语言：<el-input v-model="language"></el-input>
    <CodeEdit
      v-model="data"
      :language="language"
      @formatter="formatterCode"
    ></CodeEdit>
  </div>
</template>

<script>
import CodeEdit from "@localModules/ZhiXinLib/components/CodeEdit";
import * as sqlFormatter from 'sql-formatter'
export default {
  name: "index",
  components:{CodeEdit},
  data(){
    return{
      data:'select 1(attachment.ID) as id,1(attachment.FILE_NAME) as fileName,1(attachment.FILE_ORIGINAL_NAME) as fileOriginalName,1(attachment.TYPE) as type,1(attachment.FILE_SIZE) as fileSize,1(attachment.PATH) as path,1(attachment.FILE_URL) as fileUrl,1(attachment.UPLOAD_TYPE) as uploadType,1(attachment.CREATE_BY_ID) as createById,1(attachment.CREATE_BY) as createBy,1(attachment.CREATE_TIME) as createTime,1(attachment.UPDATE_BY_ID) as updateById,1(attachment.UPDATE_BY) as updateBy,1(attachment.UPDATE_TIME) as updateTime,attachment.REMARK as remark from attachment attachment',
      language:'sql'
    }
  },
  methods:{
    formatterCode(){
      if(this.language.toLowerCase() === 'sql'){
        this.data = sqlFormatter.format(this.data, { language: 'sql', tabWidth: 2 });
      }
    }
  }
}
</script>

<style scoped lang="scss">

</style>
